

var globalLoading //加载弹框
    , globalProgress = null //加载进度条
    ,
    PopenObj //弹框对象
    , $_$, layer, element, laytpl, op = true,
    navHref,
    differHtml; //区分当前页面
layui.use(['layer', 'element', 'laytpl', 'jquery'], function () { //独立版的layer无需执行这一句
    $_$ = layui.jquery,
        laytpl = layui.laytpl,
        layer = layui.layer; //独立版的layer无需执行这一句
    element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块

    var NavData = {
        p: [],
        v: [],
        data: []
    };
    differHtml = $_$('#nav_top_left_tlp').length;

    //导航栏点击
    element.on('nav(nav_top_left)', function (elem) {

        console.log(elem); //得到当前点击的DOM对象
        $_$('#nav_top_left li').removeClass('layui-this');
        $_$(elem).parent().addClass('layui-this');
        switch (elem[0].getAttribute('layadmin-event')) {
            case 'flexible':
                break;
            case 'menu-top':
                // console.log('nav', parseInt(elem[0].getAttribute('has-children')))
                if (parseInt(elem[0].getAttribute('has-children')) != 0) {
                    globalLoadingFun();
                    navLeftTlpFun({
                        p: {
                            id: elem[0].getAttribute('lay-id')
                        },
                        v: NavData.v
                    }); //渲染左边菜单
                    //定时器 查找是否找到按钮后结束加载弹框
                    var sit = setInterval(function () {
                        if ($_$('#menu_view ul').length != 0) {
                            //关闭父类加载弹框
                            globalParentLoadingFunClose(null);
                            this.clearInterval(sit); //清除定时器
                        }
                    }, 800);
                }
                break;
            case 'refresh':
                // 加载弹框
                globalLoadingFun();
                layer.close(globalLoading);
                //加载进度条
                globalProgressFun();
                $_$('#nav_top_left li').removeClass('layui-this');
                $_$('#LAY_app_body .layui-show iframe').attr('src', $_$('#LAY_app_body .layui-show iframe').attr('src'))
                break;
            default:
                break;
        }
    });

    //获取菜单
    switch (differHtml) {
        case 0:
            AJAX(oveUrl + "/menuCRUD/getMenuList", null, 'GET', null, null,
                function (r) {
                    if (r.code == 200 && r.data.length != 0) {
                        // console.log(r)
                        NavData.data = r.data;
                        layui.each(r.data, function (i, d) {
                            if (d.parentId != 0) {
                                NavData.v.push(d);
                            } else {
                                NavData.p.push(d);
                            }
                        });
                        if (differHtml != 0) {
                            navTopTlpFun(NavData.p); //渲染顶部菜单
                            navLeftTlpFun({
                                p: NavData.p[0],
                                v: NavData.v
                            }); //渲染左边菜单

                        } else {
                            navLeftTlpFun({ p: NavData.p, v: NavData.v }); //渲染左边菜单
                        }
                    }
                },
                function (r) {

                });
            break;
        case 1:
            $_$.getJSON('iemes/json/menu-1.2.json', v => {
                NavData.data = v;
                layui.each(v, function (i, d) {
                    if (d.parentId != 0) {
                        NavData.v.push(d);
                    } else {
                        NavData.p.push(d);
                    }
                });
                navTopTlpFun(NavData.p); //渲染顶部菜单
                navLeftTlpFun({
                    p: NavData.p[0],
                    v: NavData.v
                }); //渲染左边菜单
            })

            break;
        default:
            break;
    }



    //渲染左边菜单方法
    function navLeftTlpFun(o) {
        switch (differHtml) {
            case 0:
                o.p.sort(function (a, b) { //排序
                    if (a.menu_order == undefined) {
                        a.menu_order = 0
                    }
                    if (b.menu_order == undefined) {
                        b.menu_order = 0
                    }
                    return parseInt(a.menu_order) - parseInt(b.menu_order)
                });
                o.v.sort(function (a, b) { //排序
                    if (a.menu_order == undefined) {
                        a.menu_order = 0
                    }
                    if (b.menu_order == undefined) {
                        b.menu_order = 0
                    }
                    return parseInt(a.menu_order) - parseInt(b.menu_order)
                });
                break;
            case 1:
                o.v.sort(function (a, b) { //排序
                    if (a.menuOrder == undefined) {
                        a.menuOrder = 0
                    }
                    if (b.menuOrder == undefined) {
                        b.menuOrder = 0
                    }
                    return parseInt(a.menuOrder) - parseInt(b.menuOrder)
                });
                break
            default:
                break;
        }

        laytpl(menuTlp.innerHTML).render(o, function (html) {
            document.getElementById('menu_view').innerHTML = html;
        });
        element.render('nav'); //重新对折叠面板进行渲染
    }

    //渲染顶部菜单方法
    function navTopTlpFun(data) {
        data.sort(function (a, b) { //排序
            if (a.menuOrder == undefined) {
                a.menuOrder = 0
            }
            if (b.menuOrder == undefined) {
                b.menuOrder = 0
            }
            return parseInt(a.menuOrder) - parseInt(b.menuOrder)
        });
        laytpl(nav_top_left_tlp.innerHTML).render(data, function (html) {
            document.getElementById('nav_top_left').innerHTML = html;
        });
        element.render('nav'); //重新对折叠面板进行渲染
    }

    //页面加载完成后执行事件
    window.onload = function () {

        //定时器 查找是否找到按钮后结束加载弹框
        var sit = setInterval(function () {
            if ($_$('#menu_view ul').length != 0) {
                //左边菜单栏点击
                element.on('nav(layadmin-system-side-menu)', function (elem) {
                    console.log('左边菜单栏', elem)
                    var her = this.getAttribute("me-href");
                    if (this.getAttribute('me-hasChildren')) {
                        return
                    }
                    if (her != undefined && her.length != 0) {
                        // 加载弹框
                        // globalLoadingFun();
                        // layer.close(globalLoading);
                        //加载进度条
                        globalProgressFun();
                        console.log('NavData', NavData)
                        var id = parseInt(this.getAttribute('lay-id'));
                        console.log('id', id)
                        navHref = JSON.parse(JSON.stringify(NavData.v[id]));
                        navHref.id = 0
                        var tabElem = $_$('#LAY_app_tabsheader [lay-id="' + id + '"]')
                        var tabElemLen = $_$(tabElem).length
                        console.log('父类', $_$(this).parents('li'))
                        if (tabElemLen == 0) {
                            $_$('#LAY_app_tabsheader li').removeClass('layui-this');
                            $_$('#LAY_app_body div').removeClass('layui-show');
                            //新增一个Tab项
                            element.tabAdd('layadmin-layout-tabs', {
                                title: this.innerHTML //用于演示
                                ,
                                id: id + '' //实际使用一般是规定好的id，这里以时间戳模拟下
                                ,
                                class: 'layui-this'
                            })
                            $_$(tabElem).addClass('layui-this');

                            $_$('#LAY_app_body').append('<div lay-id="' + id + '" class="layadmin-tabsbody-item layui-show"><iframe src="views/' + this.getAttribute("me-href") + '" frameborder="0" class="layadmin-iframe"></iframe></div>')
                        } else {
                            $_$(tabElem).click();
                            $_$('#LAY_app_body [lay-id="' + id + '"] iframe').attr('src', $_$('#LAY_app_body .layui-show iframe').attr('src'))
                        }
                        $_$('#LAY_app_tabsheader [lay-id="' + id + '"]').addClass('layui-this');
                    } else {
                        layer.msg('开发中。。。暂时没有地址', {
                            shade: 0.1
                        })
                    }

                });
                //监听选项卡切换
                element.on('tab(layadmin-layout-tabs)', function (data) {
                    $_$('#LAY_app_body div').removeClass('layui-show');
                    console.log('切换', this); //当前Tab标题所在的原始DOM元素
                    // console.log(data.index); //得到当前Tab的所在下标
                    // console.log(data.elem); //得到当前的Tab大容器/layui-this
                    // console.log('top', $_$('[lay-filter="layadmin-layout-right"] [lay-id="' + this.getAttribute('lay-id') + '"]')[0])
                    // console.log('left', $_$('#LAY-system-side-menu [lay-id="' + this.getAttribute('lay-id') + '"]')[0])
                    var top = $_$('[lay-filter="layadmin-layout-right"] [lay-id="' + this.getAttribute('lay-id') + '"]')[0];
                    var le = $_$('#LAY-system-side-menu [lay-id="' + this.getAttribute('lay-id') + '"]')[0];
                    if (top != undefined) {
                        $_$('[lay-filter="layadmin-layout-right"] li').removeClass('layui-this');
                        $_$(top).parent().addClass('layui-this');
                    }
                    if (le != undefined) {
                        $_$('#LAY-system-side-menu li').removeClass('layui-nav-itemed');
                        $_$('#LAY-system-side-menu dd').removeClass('layui-this');
                        $_$(le).parents('li').addClass('layui-nav-itemed');
                        $_$(le).parent().addClass('layui-this');
                    }
                    if (isNaN(this.getAttribute('lay-id')) == false) {
                        navHref = JSON.parse(JSON.stringify(NavData.v[this.getAttribute('lay-id')]));
                        navHref.id = 0
                    }
                    console.log('nav对象', navHref);
                    $_$($_$('#LAY_app_body div')[data.index]).addClass('layui-show');
                    // console.log('切换', $_$($_$('#LAY_app_body div')[data.index]).addClass('layui-show'))
                });

                //监听选项卡删除
                element.on('tabDelete(layadmin-layout-tabs)', function (data) {
                    console.log('删除', this); //当前Tab标题所在的原始DOM元素
                    // console.log(data.index); //得到当前Tab的所在下标
                    // console.log(data.elem); //得到当前的Tab大容器
                    $_$('#LAY_app_body div').removeClass('layui-show');
                    $_$($_$('#LAY_app_body div')[data.index]).remove();
                    $_$($_$('#LAY_app_body div')[data.index == 0 ? 0 : (data.index - 1)]).addClass('layui-show');
                    // console.log('删除', $_$($_$('#LAY_app_body div')[data.index]).remove())
                    // console.log('切换', $_$($_$('#LAY_app_body div')[data.index == 0 ? 0 : (data.index - 1)]).addClass('layui-show'))
                });

                //关闭父类加载弹框
                globalParentLoadingFunClose(null);
                this.clearInterval(sit); //清除定时器
            }
        }, 2000);
    }
    globalLoadingFun();

});



//加载弹框
function globalLoadingFun() {
    globalLoading = layer.load(2, {
        time: 30000,
        shade: 0.1
    })
}

//加载进度条 progress
function globalProgressFun() {
    console.log('globalProgress', globalProgress)
    if (globalProgress == null) {
        element.progress('progress-bar', "0%");
        globalProgress = layer.load(2, {
            title: '',
            type: 1,
            shade: 0.3,
            // time: 300,
            time: 60000,
            scrollbar: false, //是否允许浏览器出现滚动条
            resize: false, //是否允许拉伸
            area: ['300px', '65px'],
            closeBtn: 0,
            content: $_$("#loed"),
            success: function () {
                $_$('.layui-layer').css("background-color", "inherit");
                $_$('.layui-layer').css("box-shadow", "inherit");
            },
            end: function () {
                $_$('.layui-layer').css("background-color", "#fff");
                $_$('.layui-layer').css("box-shadow", "1px 1px 50px rgba(0,0,0,.3)");
                element.progress('progress-bar', '0%');
                globalProgress = null
                clearInterval(sit)
            }
        })
        //定时器  加载100%后结束
        var sit = setInterval(function () {
            console.log('加载', parseInt($_$('[lay-filter="progress-bar"] div span').text()))
            if (parseInt($_$('[lay-filter="progress-bar"] div span').text()) >= 100) {
                globalProgressFunClose();
                this.clearInterval(sit); //清除定时器
            }
        }, 800);
    }
}

// 设置进度条进度方法
function setProgressFun(elem, sum) {
    // console.log('数', sum)
    element.progress(elem == null ? 'progress-bar' : elem, (parseInt($_$('[lay-filter="progress-bar"] div span').text()) + parseInt(sum)) + "%");
}
//关闭加载弹框方法
function globalLoadingFunClose() {
    layer.close(globalLoading);
}
//关闭加载进度条方法 progress
function globalProgressFunClose() {
    layer.close(globalProgress);
}